<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:p="http://primefaces.org/ui">
   <h:head>
   	<link rel="stylesheet" href="./resources/css/main.css" />
      <title>User Profile</title>
   </h:head>
   <h:body>


   <div class="clear"></div>
        
        	
   <h:panelGrid id="grid" columns="1">  
        
    
    <p:panel id="userprofile" styleClass="userProfilePanel">  
    <h:form id="formUserDetail">
        <h:panelGrid columns="3">  
            <h:outputLabel for="realname" value="Real name:" />  
            <p:inputText id="realname"   
                value="#{userBean.currentUser.realName}" required="true" label="Realname"/>  
           	<p:message for="realname" /> 
              
            <h:outputLabel for="username" value="Username:" />  
            <p:inputText value="#{userBean.currentUser.userName}" id="username" required="true" label="Username"/>  
            <p:message id = "userNameMessage" for="username" />  

            <h:outputLabel for="pwd1" value="Password:" />  
            <p:password id="pwd1" value="#{userBean.currentUser.password}" match="pwd2" label="Password 1" feedback="true" required="true"
            validatorMessage="Password must be at least 5 ciphers long, be upper and lower case and contain digits!">
							<f:validateRegex
								pattern="^(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,30}$" />
			</p:password>
  			<p:message id = "pwdMessage" for="pwd1" />
  			
            <h:outputLabel for="pwd2" value="Reenter password:" />  
            <p:password id="pwd2" value="#{userBean.currentUser.password}" label="Password 2" required="true"/>  
            <p:message id = "pwd2Message" for="pwd2" /> 
            
        	<p:commandButton value="Update profile"  action="#{userBean.updateUser}" ajax="false"/>
        </h:panelGrid> 
    </h:form>
    </p:panel>  
    
<p:panel id="Overview" header="Overview"> 
		<h:form id="Form" prependId="false">  
    <p:dataTable id="dtOverview" var="user" value="#{service.users}" >  
        <p:column id="modelHeader">   
            <f:facet name="header">  
                    Username  
            </f:facet>  
            <h:outputText value="#{user.userName}" />  
        </p:column>
  
        <p:column>  
            <f:facet name="header">  
                    Tweets  
            </f:facet>  
            <h:outputText value="#{user.tweets.size()}"/> 
        </p:column>  
  
  		<p:column>  
            <f:facet name="header">  
                    Following You  
            </f:facet>  
            <h:outputLabel value="#{userBean.currentUser.isFollowingMe(user)}"/>  
        </p:column>
  
        <p:column> 
          	<f:facet name="header">  
                    Follow  
            </f:facet>
            <p:selectBooleanButton value="#{userBean.currentUser.handleFollow(user)}" onLabel="Unfollow" offLabel="Follow" onIcon="ui-icon-check" offIcon="ui-icon-close"/>
        </p:column>  
    </p:dataTable> 
    
     
</h:form>
    </p:panel>
                
 </h:panelGrid>


<!-- Menu er flyttet her ned ellers virker det ikke. -->

         <div>
   	<ui:insert name="nav">
   	<ui:include src="nav.xhtml"/>
   	</ui:insert>
   </div>
   

</h:body>
   </html>